<template>
	<view>
		<view class="tips">
			<!-- 	<uni-search-bar placeholder="请输入搜索的内容" bgColor="#EEEEEE" @confirm="search">
			</uni-search-bar> -->
			<input name="select" @blur="setLobbyName" class="uni-input"  placeholder="请搜索平台名称" maxlength="8"/>
			<image src="../../static/imgs/search.png" @click="search" />
			<search-bar></search-bar>
		</view>
		<!-- <view class="list">
			<view class="one" @click="platform()">
				<image src="../../static/imgs/start.png"></image>
				<text>新增平台</text>
				<text class="power">免费开放</text>
			</view>
		</view> -->
		<view class="list">
			<view class="one" @click="addPingtai">
				<image src="../../static/imgs/start.png"></image>
				<text>新增平台</text>
				<text class="power">免费开放</text>
			</view>
			<view class="one"  v-for="(item) in list" @click="platform(item.id,item.name,item.rate,item.namePinyin)">
				<image :src="item.logo" :alt="item.name"></image>
				<text class="name">{{item.name}}</text>
					<text class="power">免费开放</text>
			</view>
			
			<!-- <view class="one" @click="stopAll">
				<image src="../../static/imgs/stop.png"></image>
				<text>一键停止</text>
			</view> -->
			<!--<view class="one" v-for="item in list" @click="go(item)">
				<image :src="item.platformLogo"></image>
				<text>{{item.platformName}}</text>
				 <view v-if="showBtn" class="btns-view">
					<text>删除</text>
					<text>停止</text>
				</view> 
			</view>-->
		</view>
	</view>
</template>

<script>
	import {
		PLATFORM_LIST,
		SELECT
	} from "../../constants/index.js";
	
	
	var _self;
		
	export default {
		
		data() {
			return {
				list: [],
				keyword: '',
				select: ''
			};
		},
		onLoad() {
			this.getList()
		},
		created() {
			_self=this;
		},
		methods: {
			// 获取所有数据
			getList() {
				this.$request.post(PLATFORM_LIST, {keyword: this.keyword}).then(res => {
					this.list = res
					console.log(this.list)
				})
			},
			search() {
				if(this.select.length<=0){
					return _self.getList();
				}
				this.$request.post(SELECT, {select:this.select}).then(res => {
					this.list = res
				})
			},
			// 点击刷单平台跳转
			platform(id,name,rate,namePinyin){
				uni.navigateTo({
					url:'../order/order?pname='+decodeURIComponent(name)+'&pid='+decodeURIComponent(id)+'&prate='+decodeURIComponent(rate)+'&pnamePinyin'+decodeURIComponent(namePinyin)
					// url: '../order/order?pname='+decodeURIComponent(name)+'&prate='+decodeURIComponent(rate)+'&pid='+decodeURIComponent(id)+'&pnamePinyin='+decodeURIComponent(namePinyin)
				})
			},
			//新增平台
			addPingtai(){
				uni.navigateTo({
					url:'../order/add'
				})
			},
			setLobbyName(e){
							this.select = e.detail.value
						},
		}
	}
</script>

<style lang="scss">
	.search-result {
		margin-top: 10px;
		margin-bottom: 20px;
		text-align: center;
	}

	.search-result-text {
		text-align: center;
		font-size: 14px;
	}

	.power {
		background-color: rgb(247, 149, 184);
		color: #fff;
		margin-top: 30rpx;
		padding: 0 16rpx;
		border-radius: 20rpx;
		font-size: 24rpx;
	}

	.example-body {
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		padding: 0px;
	}

	image {
		height: 50px;
		width: 50px;
		border-radius: 50%;
		border: 1px solid #e5e5e5;
		margin-bottom: 10rpx;
	}

	.one {
		float: left;
		font-size: 24rpx;
		display: flex;
		flex-direction: column;
		width: calc((100% - 5px) / 4);
		align-items: center;
		border-right: 1px solid #e5e5e5;
		border-bottom: 1px solid #e5e5e5;
		padding: 40rpx 0 20rpx 0;
		position: relative;
	}

	.tips {
		font-size: 24rpx;
		padding-bottom: 1rpx;
		border-bottom: 1px solid #e5e5e5;
	}

	.tips image {
		width: 40rpx;
		height: 40rpx;
		position: absolute;
		top: 1%;
		right: 3%;
	}

	.uni-input {
		border: 1px solid #E5E5E5;
		height: 40rpx;
		border-radius: 10rpx;
		width: 90%;
		margin: 10rpx auto;
	}
</style>
